<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/content.css">
    <title>用户列表</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.css">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js" type="text/javascript"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/js/bootstrap.js" type="text/javascript"></script>
</head>
<body>
<div class="alert alert-success" th:if="${session.tips != null}">
    <strong th:text="${session.tips}">成功!</strong>
</div>
    <main>
      <ul class="leftUl">
        <li class="ulTitle">图书管理系统</li>
        <li><a href="/home">主页</a></li>
        <li><a href="/book">图书列表</a></li>
        <li><a href="/userBook">已借列表</a></li>
        <li class="active" th:if="${!(session.user == null || session.user.getUser_permission() != 1)}"><a href="/user">用户列表</a></li>
        <li th:if="${!(session.user == null || session.user.getUser_permission() != 1)}"><a href="/editbook">图书编辑</a></li>
        <li class="login" th:if="${session.user == null}"><a href="/login">登录</a></li>
        <li class="user" th:if="${session.user != null}"><span th:text="${session.user.getUser_name()}">某某某</span><div class="exit" onclick="exit()">退出登录</div></li>
    </ul>
    <div class="main">
        <table>
          <tr>
            <th>用户名</th>
            <th>名称</th>
            <th>密码</th>
            <th>权限</th>
            <th>操作</th>
          </tr>
          <tr th:each="user : ${session.users}">
            <td th:text="${user.getUser_id()}" class="user_id">id</td>
            <td th:text="${user.getUser_name()}">name</td>
            <td th:text="${user.getUser_password()}">password</td>
            <td><span th:if="${user.getUser_permission()==0}">普通用户</span><span th:if="${user.getUser_permission()==1}">管理员</span></td>
            <td>
              <button class="edit-button">编辑</button>
              <button class="delete-button">删除</button>
            </td>
          </tr>
        </table>
        <div class="operatePage">
            <button class="pagination-button" th:onclick="|first('user',${session.page.getPageNow()})|">首页</button>
            <button class="pagination-button" th:onclick="|previous('user',${session.page.getPageNow()})|">上一页</button>
            <span class="currentPage" th:text="'第'+${session.page.getPageNow()}+'页'">第1页</span>
            <span class="totalPage" th:text="'第'+${session.page.getEnd()}+'页'">共1页</span>
            <button class="pagination-button" th:onclick="|next('user',${session.page.getPageNow()},${session.page.getEnd()})|">下一页</button>
            <button class="pagination-button" th:onclick="|end('user',${session.page.getPageNow()},${session.page.getEnd()})|">尾页</button>
            <input type="number" class="pagination-input" placeholder="">
            <button class="pagination-button" onclick="jump('user')">跳转</button>
        </div>
        <script src="js/page.js"></script>
    </div>
    </main>
</body>

<script src="js/userOperate.js"></script>
<script src="js/index.js"></script>
</html>